<template>
    <div class="com_box" v-loading="loading" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0)">
        <TaskFeixing ref="feixing_task" />
        <div class="com_tab_content flexbox flexcenter flexbetween sticky_box">
            <div class="com_tab_box flexbox flexcenter">
                <div class="com_tab_item" @click="selectTab(item)" :class="{'active':item.id==active}" v-for="item in tabList" :key="item.id">{{item.nickname}}</div>
            </div>
            <div class="flexbox flexcenter">
                <el-tooltip content="任务列表" placement="top">
                    <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg" @click="openTaskList" style="cursor: pointer;">
                        <path d="M9 10.5C9 9.94772 9.44772 9.5 10 9.5H22C22.5523 9.5 23 9.94772 23 10.5V24C23 24.5523 22.5523 25 22 25H10C9.44772 25 9 24.5523 9 24V10.5Z" stroke="#616C85" stroke-width="2" stroke-linecap="round" />
                        <path d="M12 8.5C12 7.94772 12.4477 7.5 13 7.5L19 7.5C19.5523 7.5 20 7.94772 20 8.5V10.5C20 11.0523 19.5523 11.5 19 11.5H13C12.4477 11.5 12 11.0523 12 10.5V8.5Z" fill="white" stroke="#616C85" stroke-width="2" stroke-linecap="round" />
                        <path d="M16 15V21M16 21L13.5 19M16 21L18.5 19" stroke="#616C85" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
                    </svg>
                </el-tooltip>
                <el-button type="primary" size="small" style="margin-left:12px" @click="expotGoods">
                    <div class="flexbox flexcenter flexjust">
                        <svg width="16" height="16" viewBox="0 0 16 16" stroke='white' class="btn_svg" fill="none" xmlns="http://www.w3.org/2000/svg">
                            <path d="M14 9C14 10.875 12.6667 14 8 14C3.33333 14 2 10.875 2 9" stroke="white" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round" />
                            <path d="M8 2V11" stroke="inherit" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round" />
                            <path d="M8 2V11" stroke="inherit" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round" />
                            <path d="M4 6L8 2L12 6" stroke="inherit" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round" />
                            <path d="M4 6L8 2L12 6" stroke="inherit" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round" />
                        </svg>
                        导出数据
                    </div>
                </el-button>
            </div>
        </div>
        <div class="pd_20">
            <GoodsData ref="goods" />
        </div>
    </div>
</template>

<script>
import "@/assets/css/medium.css";
import GoodsData from "./GoodsData";
import TaskFeixing from "./TaskFeixing";
export default {
    components: {
        GoodsData,
        TaskFeixing,
    },
    name: "",
    data() {
        return {
            active: 0,
            loading: false,
            tabList: [
                {
                    id: 0,
                    nickname: "商品/品牌集选号",
                },
                {
                    id: 2,
                    nickname: "排行榜选号",
                },
                {
                    id: 3,
                    nickname: "内容选号",
                },
            ],
        };
    },
    created() {},
    methods: {
        selectTab(item) {
            this.active = item.id;
            this.$refs.goods.formData.task_type = item.id;
        },

        // 打开任务列表
        openTaskList() {
            this.$refs.feixing_task.getData();
        },

        //导出商品
        async expotGoods() {
            this.$refs.goods.submitForm("editForm")
            return
            let list = JSON.parse(JSON.stringify(this.$refs.goods.formData));
            if (!list.task_name) {
                this.$message.error("请输入文件名称");
                return;
            }
            list.fg_options.max_like_count =
                list.fg_options.max_like_count !== ""
                    ? Number(list.fg_options.max_like_count)
                    : "";
            list.fg_options.blogger_fans =
                list.fg_options.blogger_fans !== ""
                    ? Number(list.fg_options.blogger_fans)
                    : "";
            list.fg_options.sales_interval =
                list.fg_options.sales_interval !== ""
                    ? Number(list.fg_options.sales_interval)
                    : "";
            for (let i in list.xt_options) {
                if (i == "price") {
                    for (let s in list.xt_options[i]) {
                        list.xt_options[i][s].min =
                            list.xt_options[i][s].min !== ""
                                ? Number(list.xt_options[i][s].min)
                                : "";
                        list.xt_options[i][s].max =
                            list.xt_options[i][s].max !== ""
                                ? Number(list.xt_options[i][s].max)
                                : "";
                        delete list.xt_options[i][s].unit;
                        delete list.xt_options[i][s].text;
                        delete list.xt_options[i][s].first_text;
                        delete list.xt_options[i][s].second_text;
                        delete list.xt_options[i][s].visible;
                        delete list.xt_options[i][s].ischeck;
                    }
                } else {
                    for (let s in list.xt_options[i]) {
                        for (let a in list.xt_options[i][s]) {
                            list.xt_options[i][s][a].min =
                                list.xt_options[i][s][a].min !== ""
                                    ? Number(list.xt_options[i][s][a].min)
                                    : "";
                            list.xt_options[i][s][a].max =
                                list.xt_options[i][s][a].max !== ""
                                    ? Number(list.xt_options[i][s][a].max)
                                    : "";
                            delete list.xt_options[i][s][a].unit;
                            delete list.xt_options[i][s][a].text;
                            delete list.xt_options[i][s][a].first_text;
                            delete list.xt_options[i][s][a].second_text;
                            delete list.xt_options[i][s][a].visible;
                            delete list.xt_options[i][s][a].ischeck;
                        }
                    }
                }
            }
            this.loading = true;
            const { data: res } = await this.$http.post(
                "https://meijie.jcmasz.com:8910/create_task",
                list,
                {
                    headers: {
                        "content-type":
                            "application/x-www-form-urlencoded; Charset=UTF-8",
                        Accept: "application/json, text/plain, */*",
                    },
                }
            );
            if (res.code !== 200) {
                this.loading = false;
                this.$message.error(res.msg);
                return;
            } else {
                this.loading = false;
                this.$message({
                    message: res.msg,
                    type: "success",
                });
            }
        },
    },
};
</script>


<style scoped>
</style>


